<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <main>
        <video id="videoUrl" muted></video>
        <div>
            <div><span id="num">0</span>/<span>4</span></div>
            <p id="title">髋关节环绕</p>
        </div>

    </main>

    <footer>
        <i class="iconfont iconxueyuan-shangyijie" id="proVideo"></i>
        <i class="iconfont iconzanting" id="swith"></i>
        <i class="iconfont iconxueyuan-xiayijie" id="nextVideo"></i>
    </footer>
<!-- 进度条 -->
    <div class="jindu" id="jinduJs"></div>


    <!-- 模态框 -->
    <div class=" motai">

       <div class="container">
        <p class="title02">顽强的毅力可以征服世界上任何一座高峰</p>


        <div class="dingwei">
            <div class="title01">
                <div class="continue" id="jixu">
                    <i class=" iconfont iconicon_play"></i>
                    继续训练
                </div>
                <div class="continue  bgred" id="jieshu">
                    <i class="iconfont iconjieshu"></i>
                    结束训练
                </div>
            </div>
            <div class="sport-title" >
                <img src="../image/dog.jpg" alt="" id="touxiang1">
                <div>
                    标题
                    <p id="title03">跨关节环绕</p>
                </div>
            </div>
        </div>
       </div>
    </div>
</body>

</html>